<template>
  <span>
    <el-table :data="tableZzjg" border class="table-1" height="400">
      <el-table-column label="序号" type="index" fixed="left" width="50">
        <template slot-scope="scope">
          <span>{{ scope.$index + page.pageIndex*page.pageSize + 1 }}</span>
        </template>
      </el-table-column>
      <el-table-column fixed prop="name" label="姓名" />
      <el-table-column fixed prop="labor" label="党内分工" />
      <el-table-column fixed prop="employdate" label="起任时间" />
      <el-table-column fixed prop="partydate" label="入党时间" />
      <el-table-column v-if="optioncol" fixed="right" label="操作" width="200">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEdit(scope.row)">编辑</el-button>
          <el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <Pagination :pagesetting.sync="page" :total-count="totalCount" />
  </span>
</template>
<script>
import '@/styles/el-tabs.scss'
import { deleteUsersInfo } from '@/api/zzxt'
export default {
  name: 'Table',
  components: { Pagination: () => import('@/components/Pagination') },
  props: {
    tableZzjg: { type: Array, default: () => [] },
    isEdit: { type: Boolean, default: true },
    optioncol: { type: Boolean, default: () => false },
    totalCount: { type: Number, default: 0 }
  },
  data: () => ({
    page: { pageIndex: 0, pageSize: 10 }
  }),
  watch: {
    page: {
      handler(val) {
        this.$emit('update:page', val)
      },
      deep: true
    }
  },
  methods: {
    handleEdit(row) {
      this.$emit('update:isEdit', false)
      this.$emit('update:dialogFormVisible', true)
      this.$emit('update:title', '修改人员信息')
      this.$emit('update:zzjg_form', row)
    },
    handleDelete(row) {
      deleteUsersInfo(row.name, row.draftdate).then(data => {
        this.$message.success('成功删除')
      })
    }
  }
}
</script>
